<div class="layui-card layadmin-header">
  <div class="layui-breadcrumb" lay-filter="breadcrumb">
    <a lay-href="">主页</a>
    <a><cite>资金归集</cite></a>
    <a><cite>营销红包分账</cite></a>
    <a><cite>领包明细</cite></a>
  </div>
</div>

<div class="layui-fluid">
  <div class="layui-card">
    <div class="layui-tab layui-tab-brief">
      <ul class="layui-tab-title">
        <li class="layui-this">红包明细列表</li>
      </ul>
      <div class="layui-tab-content">
        <div class="layui-tab-item layui-show">
          <div class="layui-row">
            <div class="layui-form" style="float:right;">
              <div class="layui-form-item" style="margin:0;">
                <div class="layui-input-inline">
                  <input type="text" name="id" id="id" placeholder="ID" autocomplete="off" class="layui-input">
                </div>
                <a id="search" class="layui-btn" data-type="reload"><i class="layui-icon layui-icon-search"></i>搜索</a>
              </div>
            </div>
          </div>

          <div class="layui-form-item" style="margin-top:10px">
            <blockquote class="layui-elem-quote" id="amountTip">
              今日发放总额:<span id="todayGrantAmount" style="color: blue; margin-right: 10px;"></span>
              昨日发放总额:<sapn id="yesterDayGrantAmount" style="color: blue; margin-right: 10px;"></sapn>
            </blockquote>
          </div>
          <div class="layui-row">
            <div class="layuiAdmin-btns" style="margin-bottom: 10px;"></div>
          </div>
          <table id="XxPay_Mgr_Alipay_Cash_detail_dataAll" lay-filter="XxPay_Mgr_Alipay_Cash_detail_dataAll"></table>
        </div>

      </div>
    </div>
  </div>
</div>

<!--<script type="text/html" id="xxpayBar">
  <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="view">查看</a>
</script>-->
<script>
  layui.use(['admin', 'table', 'util'], function(){
    var $ = layui.$
      ,admin = layui.admin
      ,table = layui.table
      ,element = layui.element
      ,form = layui.form;

    element.render('breadcrumb', 'breadcrumb');

      $.setGrantResult = function() {

          var id = $('#id').val();
          admin.req({
              type: 'get',
              url: layui.setter.baseUrl + '/alipayCash/statistic',
              data:{id: id},
              error: function(err){
                  layer.alert(JSON.stringify(err.field), {
                      title: '错误提示'
                  })
              },
              success: function(res){
                  if(res.code == 0){
                      $('#yesterDayGrantAmount').html("￥" + res.data.yesterdayAmount/100.00);
                      $('#todayGrantAmount').html("￥" + res.data.todayAmount/100.00);
                  }
              }
          });
      };


    var tplStatus = function(d){
      if(d.status == 0) {
        return "<span style='color: goldenrod'>待发放</span>";
      }else if (d.status == 1){
        return "<span style='color: green'>分账成功</span>";
      }else if (d.status == 2){
          return "<span style='color: red'>分账失败</span>";
      }else if (d.status == 3){
          return "<span style='color: red'>已取消发放</span>";
      }
    };

    //商户列表
    table.render({
      elem: '#XxPay_Mgr_Alipay_Cash_detail_dataAll'
      ,url: layui.setter.baseUrl + '/alipayCash/detailList' //列表接口
      ,where: {
          access_token: layui.data(layui.setter.tableName).access_token
      }
      ,id: 'tableReload'
      ,page: true
      ,cols: [[
        {field: 'id', width: 100, title: 'ID'}
        ,{field: 'cashId', title: '红包记录ID'}
        ,{field: 'cashUserId', title: '红包用户'}
        ,{field: 'alipayLoginId', title: '账号快照'}
        ,{title: '预计分账金额(元)', templet: '<div>{{ d.planAmount != null ? d.planAmount/100 : "" }}</div>', width: 150}
        ,{title: '实际到账金额(元)', templet: '<div>{{ d.realAmount != null ? d.realAmount/100 : "" }}</div>', width: 150}
        ,{field: 'status', title: '状态', templet: tplStatus}
        ,{field: 'alipayErrorMsg', title: '错误消息'}
        ,{field: 'createTime', title: '创建时间', width: 200, templet: '<div>{{ layui.util.toDateString(d.createTime, "yyyy-MM-dd HH:mm:ss") }}</div>'}
        // ,{field: 'edit', title: '操作', width: 100, toolbar: '#xxpayBar' }
      ]]
      ,skin: 'line'
      ,done: function(){
            $.setGrantResult();
      }
    });

    //监听工具条
    table.on('tool(XxPay_Mgr_Alipay_Cash_detail_dataAll)', function(obj){
      var data = obj.data;
    });

    // 搜索
    var $ = layui.$, active = {
      reload: function(){
        var id = $('#id').val();
        //执行重载
        table.reload('tableReload', {
          page: {
            curr: 1 //重新从第 1 页开始
          }
          ,where: {
                id: id,
          }
        });
      }
    };
    $('#search').on('click', function() {
      var type = $(this).data('type');
      active[type] ? active[type].call(this) : '';
    });

    // 渲染表单
    form.render();
  });
</script>